<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <h1 id="targetDom">在此显示ajax请求来的数据</h1>
  <button onclick='ajax_kuaidi()'>发送GET请求</button>
  <script>

    function ajax_kuaidi(param) {
      let http = new XMLHttpRequest()
      let num = Math.floor(Math.random()*10)
      // 利用mockjs 自己制作接口数据
      http.open('get', `http://localhost:3000/users?id=${num}`, true)
      console.log(http);
      http.send();
      http.onreadystatechange = function () {
        if (http.readyState == 4 && http.status == 200) {
          let res = JSON.parse(http.responseText)[0]
          console.log(res);
          document.getElementById("targetDom").innerHTML = 
          `
          <img src='${res.img}'></img>
          <p>${res.name}</p>
          `
          ;
        }
      }
    }


  </script>
</body>

</html>